{{!
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements.  See the NOTICE file
* distributed with this work for additional information
* regarding copyright ownership.  The ASF licenses this file
* to you under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance
* with the License.  You may obtain a copy of the License at
*
*     http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
}}

{{#if view.service.isRestartRequired}}
  {{#isAccessible ADMIN}}
    <div id="summary-restart-bar">
      <div class="alert alert-warning clearfix">
        <i class="icon-refresh"></i> {{{view.needToRestartMessage}}} {{t services.service.config.restartService.needToRestart}}
        <a href="#" {{action showComponentsShouldBeRestarted controller.content target="App.router.mainServiceInfoConfigsController"}}>{{view.componentsCount}} {{pluralize view.componentsCount singular="t:common.component" plural="t:common.components"}}</a> {{t on}}
        <a href="#" {{action showHostsShouldBeRestarted controller.content target="App.router.mainServiceInfoConfigsController"}}>{{view.hostsCount}} {{pluralize view.hostsCount singular="t:common.host" plural="t:common.hosts"}}</a>
        <span class="restart-components pull-right">&nbsp</span>

        <div class="btn-group pull-right">
          <button type="button" class="btn btn-default dropdown-toggle btn-warning" data-toggle="dropdown">
            {{t hosts.host.details.needToRestart.button}}
            <span class="caret"></span>
          </button>
          <ul class="dropdown-menu">
            <li>
              <a href="#" {{action restartAllStaleConfigComponents target="view"}}>{{t restart.service.all.affected}}</a>
            </li>
            {{#if view.rollingRestartSlaveComponentName}}
              <li>
                <a href="#" {{action rollingRestartStaleConfigSlaveComponents view.rollingRestartSlaveComponentName target="view"}}>{{view.rollingRestartActionName}}</a>
              </li>
            {{/if}}
          </ul>
        </div>
      </div>
    </div>
  {{/isAccessible}}
{{/if}}

<div class="service-block">
  <div class="box">
    <div class="box-header summary-box-header">
      <h4>{{controller.content.label}} {{t services.service.info.menu.summary}}</h4>
      {{#if view.hasAlertDefinitions}}
        {{#if view.alertsCount}}
          <span {{action "showServiceAlertsPopup" controller.content target="controller"}}
            {{bindAttr class=":label :pull-right view.hasCriticalAlerts:alerts-crit-count:alerts-warn-count"}}>
            {{view.alertsCount}} {{pluralize view.alertsCount singular="alert" plural="alerts"}}</span>
        {{else}}
          <span {{action "showServiceAlertsPopup" controller.content target="controller"}}
                  class="label pull-right no-alerts-label">{{t services.service.summary.alerts.noAlerts}}</span>
        {{/if}}
      {{/if}}
    </div>
    {{#if view.serviceSummaryView}}
      <div class="service-content row-fluid">
        <div class="span6">
          <table class="summary-info table no-borders table-condensed">
            <tbody>
            {{view view.serviceSummaryView}}
            </tbody>
          </table>
        </div>
      </div>
    {{else}}
      <div class="spinner"></div>
    {{/if}}
  </div>

  {{! widgets in the metrics panel are loaded seperately from summary page text information
      and does not get block due to any global API poller information }}
  {{#if view.isServiceMetricLoaded}}
    <div class="service-metrics-block">
      <div class="box">
        <div class="box-header">
          <h4>{{t services.service.metrics}}</h4>
          {{#if showTimeRangeControl}}
            <div class="btn-group pull-right">
              <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
                {{view.currentTimeRange.name}} &nbsp;<span class="caret"></span>
              </button>
              <ul class="dropdown-menu">
                {{#each option in view.timeRangeOptions}}
                  <li><a href="#" {{action setTimeRange option target="view"}}>{{option.name}}</a></li>
                {{/each}}
              </ul>
            </div>
          {{/if}}
          {{#if isServiceWithEnhancedWidgets}}
            {{#if isAmbariMetricsInstalled}}
              <div class="btn-group pull-right actions">
                <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
                  {{t common.actions}} &nbsp;<span class="caret"></span>
                </button>
                <ul class="dropdown-menu">
                  {{#each option in view.widgetActions}}
                    <li {{bindAttr class="option.layouts:dropdown-submenu"}}>
                      {{#if option.isAction}}
                        <a href="#" {{action doWidgetAction option.action target="view"}}>
                          <i {{bindAttr class="option.class"}}></i>
                          {{option.label}}
                        </a>
                        {{#if option.layouts}}
                          <ul class="dropdown-menu">
                            {{#each layout in option.layouts}}
                              <li>
                                <a href="javascript:void(0);">
                                  {{layout.layoutName}}
                                </a>
                              </li>
                            {{/each}}
                          </ul>
                        {{/if}}
                      {{/if}}
                    </li>
                  {{/each}}
                </ul>
              </div>
            {{/if}}
          {{/if}}
        </div>
        <div>
          {{#if isServiceWithEnhancedWidgets}}
            <div id="widget_layout" class="row-fluid">
              {{#each widget in controller.widgets}}
                <div class="widget span2p4" {{bindAttr id="widget.id"}}>
                  {{view widget.viewClass contentBinding="widget" idBinding="widget.id"}}
                </div>
              {{/each}}
              {{#if isAmbariMetricsInstalled}}
                <div class="span2p4">
                  <button id="add-widget-action-box"
                          class="btn btn-default" {{action "goToWidgetsBrowser" controller.content target="controller"}}
                          rel="add-widget-tooltip" {{translateAttr data-original-title="dashboard.widgets.addButton.tooltip"}}>
                    <i class="icon-plus"></i></button>
                </div>
              {{/if}}
            </div>
          {{/if}}
          <table class="graphs">
            {{#each graphs in view.serviceMetricGraphs}}
              <tr>
                {{#each graph in graphs}}
                  <td>
                    <div class="">
                      {{view graph}}
                    </div>
                  </td>
                {{/each}}
              </tr>
            {{/each}}
          </table>
        </div>
      </div>
    </div>
  {{/if}}
</div>

{{#if view.collapsedSections}}
  <div class="row-fluid">
    <div class="span12 metrics-collapsed-graphs">
      {{#each collapsedSection in view.collapsedSections}}
        <div {{bindAttr class=":accordion collapsedSection.toggleIndex"}}>
          <div class="accordion-group box">
            <div class="accordion-heading box-header">
              <span class="pull-left accordion-toggle"
                    data-toggle="collapse" {{bindAttr dataParent="collapsedSection.toggleIndex" href="collapsedSection.toggleIndex"}}>
                <i class="pull-left icon-caret-toggle"></i>
                <span>{{collapsedSection.header}}</span>
              </span>
              <a class="btn pull-right" {{bindAttr href="collapsedSection.url"}} target="_blank">
                <i class="icon-link"></i>
              </a>

              <div class="clearfix"></div>
            </div>
            <div class="accordion-body collapse in" {{bindAttr id="collapsedSection.id"}}>
              <div class="accordion-inner">
                {{#if collapsedSection.metricView}}
                  {{view collapsedSection.metricView viewDataBinding="collapsedSection.metricViewData"}}
                {{/if}}
              </div>
            </div>
          </div>
        </div>
      {{/each}}
    </div>
  </div>
{{/if}}





